<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./../template/DefaultTemplate.xhtml"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:h="http://java.sun.com/jsf/html">

    <ui:define name="top">
        Password Reminder
    </ui:define>

    <ui:define name="content">
        <h:form id="form1">
            <p:panel header="Password Reset">
                <p:messages id="msgs" showDetail="true"/>
                <p:wizard widgetVar="wiz" showNavBar="false" flowListener="#{loginManagerBean.onFlowProcess}"> 
                    <p:tab id="email" title="Email">
                        <p:panel>
                            <h:panelGrid columns="3">
                                <h:outputText value="Please input your email address: "/>
                                <p:inputText id="inputtedEmail" value="#{loginManagerBean.inputtedEmail}" 
                                             validator="#{loginManagerBean.checkEmailExists}"
                                             required="true" requiredMessage="Please input your email address."/>
                                <p:message for="inputtedEmail"/>
                            </h:panelGrid>
                        </p:panel>
                    </p:tab>

                    <p:tab id="secQns" title="SecureQns">
                        <p:panel header="Secure Question">
                            <h:panelGrid columns="3">
                                <h:outputText value="Secure Question:"/>
                                <h:outputText value="#{loginManagerBean.secureQns}"/>
                                <h:outputText value=""/>

                                <h:outputText value="Answer:"/>
                                <h:inputText id="inputtedAns" value="#{loginManagerBean.inputtedAns}" validator="#{loginManagerBean.checkSecureAnswer}"
                                             required="true" requiredMessage="Please input the answer."/>
                                <p:message for="inputtedAns"/>
                            </h:panelGrid>
                        </p:panel>
                    </p:tab>

                    <p:tab id="pwdNew" title="NewPassword">
                        <p:panel header="New Password">
                            <h:panelGrid columns="3">
                                <h:outputText value="New password"/>
                                <p:password id="pwd" inline="true" feedback="true" minLength="6" value="#{loginManagerBean.newPassword}" required="true" requiredMessage="Please input password."/>
                                <p:message for="pwd"/>

                                <h:outputText value="Re-enter password:"/>
                                <h:inputSecret id="pwd2" validator="#{loginManagerBean.validateSamePassword}" required="true" requiredMessage="Please re-enter the password"/>
                                <p:message for="pwd2"/>
                            </h:panelGrid>
                        </p:panel>
                    </p:tab>

                    <p:tab id="reset" title="ResetPassword">
                        <p:panel header="Reset">
                            <p>
                                Click the reset button to confirm your password resetting.
                            </p>
                            <p>
                                Please note that your account will be disabled until you reactivate it from email.
                            </p>
                            <p:commandButton value="Reset" actionListener="#{loginManagerBean.passwordReset}" 
                                             widgetVar="resetBtn" oncomplete="resetBtn.disable()" update="msgs" />
                        </p:panel>
                    </p:tab>
                </p:wizard>
                <p:commandButton value="Next" ajax="true" onclick="wiz.next();"/>
                <p:ajaxStatus style="width: 16px;height: 16px;">
                    <f:facet name="start">
                        <h:graphicImage value="./../images/ajaxloading.gif"/>
                    </f:facet>
                    <f:facet name="complete">
                        <h:outputText value=""/>
                    </f:facet>
                </p:ajaxStatus>
            </p:panel>
        </h:form>
    </ui:define>

    <ui:define name="bottom">
       
    </ui:define>

</ui:composition>
